<template>
  <div>About</div>
  <div>
    {{ name1 }}
  </div>
</template>

<script lang='ts'>
import { defineComponent, reactive, toRefs, onBeforeMount, onMounted, computed } from 'vue'
import { useStore } from 'vuex'
export default defineComponent({
  name: 'AboutView',
  setup () {
    const data = reactive({})
    const store = useStore()
    const name1 = computed(() => {
      return store.state?.student?.name || ''
    })
    onBeforeMount(() => {
      //  2.组件挂载页面之前执行----onBeforeMount
    })
    onMounted(() => {
      //  3.组件挂载到页面之后执行-------onMounted
    })
    return {
      ...toRefs(data),
      name1
    }
  }
})
</script>

<style scoped lang='less'>
</style>
